/**
 * Copyright (C) 2009 alex <me@alex.0x08.org>
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *         http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

html {
    background:#888;
    color:#000;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

h1.sitehead {
    font-size: 1.5em;
    padding: .5em .5em .5em 4.5em; /* top-left-bottom-right */
    background: url('../img/flag.png') left no-repeat;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

h2.hack-work {
    padding:0em 1.2em 0em 1.2em;
    background:url('../img/ack.gif') left no-repeat;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

h2.download {
    padding:0em 0em 0em 2em;
    background:url('../img/download.gif') left no-repeat; }

h2.support {
    padding:0em 0em 0em 2em;
    background:url('../img/support.gif') left no-repeat; }

h2.tuneup {
    padding:0em 0em 0em 2em;
    background:url('../img/tuneup.gif') left no-repeat; }

h2.contrib {
    padding:0em 0em 0em 2em;
    background:url('../img/contrib.gif') left no-repeat; }


/* General styles */
.colmask {
    position:relative;
    clear:both;
    float:left;
    width:100%;
    overflow:hidden;
    margin-top:10px;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.leftmenu .colright {
    float:left;
    width:200%;
    position:relative;
    left:200px;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.leftmenu .col1wrap {
    float:right;
    width:50%;
    position:relative;
    right:200px;
    padding-bottom:1em;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.leftmenu .col1 {
    margin:0 15px 0 180px;
    position:relative;
    right:100%;
    overflow:hidden;
    font-size:12px;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.leftmenu .col1 a {
    color:#444;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.leftmenu .col1 a:hover {
    color:#222;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.leftmenu .menu {
    float:left;
    width:150px;
    position:relative;
    right:200px;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.navigation {
    color:#FFF;
    background-color:#333;
    font-family:Tahoma;
    font-size:11px;
    padding:11px 0px 11px 0px;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.navigation ul {
    padding:0px;
    margin:0px;
    text-align:right;
    list-style-type:none;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.navigation li {
    display:inline;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.navigation li a {
    color:#CCC;
    text-decoration:none;
    background-color:#333;
    padding:6px 8px 7px 8px;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.navigation li a:hover {
    color:#FFF;
    text-decoration:none;
    background-color:#006666;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

pre.code {                   
    background:#999;
    border:0.06em solid #AAA;
    /*        margin:0em 1.75em;
            padding: 0.5em;
            overflow:auto; } */
    padding: 0.31em 0.31em 0.31em 0.31em;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.menu {
    font-size:11px;
    font-weight:normal;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.menu ul {
    list-style-type:none;
    padding:0;
    margin:0;
    border:none;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.menu li a {
    color:#CCC;
    background:#333;
    display:block;
    margin:0;
    padding:10px 0px 10px 10px;
    text-decoration:none;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.menu a:hover {
    background:#006666;
    color:#FFF;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.menu li.selected a {
    color:#FFF;
    background-color:#006666;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.ceiling {
    font-style:italic;
    margin-bottom:6px;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.footer {
    border-top:1px solid #000;
    font-size:11px;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.footer p a {
    color:#444;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

.footer p a:hover {
    color:#222;
    font-family: Arial, Verdana, Helvetica, sans-serif; }

/* for tests */


.footer-test {
    border-top:1px solid #fff;
    font-size:11px;
    font-family:Tahoma; }

.footer-test p a {
    color:#444; }

.footer-test p a:hover {
    color:#222; }



/*ul.polaroids { width: 970px; margin: 0 0 18px -30px; }*/

ul.polaroids li { display: inline; }
ul.polaroids a.to-full { background: #fff;
                         display: inline;
                         float: left;
                         margin: 0 0 27px 30px;
                         width: auto;
                         padding: 10px 10px 15px;
                         text-align: center;
                         font-family: "Marker Felt", sans-serif;
                         text-decoration: none;
                         color: #333;
                         font-size: 18px;
                         -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25);
                         -moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);
                         -webkit-transform: rotate(-2deg);
                         -webkit-transition: -webkit-transform .15s linear;
                         -moz-transform: rotate(-2deg);
}
ul.polaroids img { display: block; width: 190px; margin-bottom: 12px; }
ul.polaroids a.to-full:after { content: attr(title); }

ul.polaroids li:nth-child(even) a.to-full {
    -webkit-transform: rotate(2deg);  -moz-transform: rotate(2deg);
}
ul.polaroids li:nth-child(3n) a {
    -webkit-transform: none;
    position: relative;
    top: -5px;
    -moz-transform: none;
}
ul.polaroids li:nth-child(5n) a {
    -webkit-transform: rotate(5deg);
    position: relative;
    right: 5px;
    -moz-transform: rotate(5deg);
}
ul.polaroids li:nth-child(8n) a { position: relative; right: 5px; top: 8px; }
ul.polaroids li:nth-child(11n) a { position: relative; left: -5px; top: 3px; }

ul.polaroids li.messy a.to-full {
    margin-top: -375px;
    margin-left: 160px;
    -webkit-transform: rotate(-5deg);
    -moz-transform: rotate(-5deg);
}

ul.polaroids li a.to-full:hover {
    -webkit-transform: scale(1.25);
    -moz-transform: scale(1.25);
    -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.5);
    -moz-box-shadow: 0 3px 6px rgba(0,0,0,.5);
    position: relative;
    z-index: 5;
}

.first {
    padding: 5px 5px;
    border: solid 1px #E5E5E5;
    margin: 10px 10px 10px 5px;

    outline: 0;
    background: #FFFFFF left top repeat-x;
    background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
    background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
    box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
    -moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
    -webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
}

.first:hover,  .first:focus {
    border-color: #C9C9C9;
    -webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;
}


.reply:hover .actionButton
{
    opacity:1;
    top: 0;
}

.reply:hover
{
    border: 1px solid #9acbdf;
}


.reply {

    color:#667;
    border: 1px solid #eee;
    text-shadow: 0px 1px 0px #eee;
    position:relative;


    background: #e8eaec ;
    /* for non-css3 browsers */

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d5d8da', endColorstr='#e4e7e9'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#d5d8da), color-stop(0.3,#e4e7e9), color-stop(0.9,#e8eaec),to(#f0f3f5));
    background: -moz-linear-gradient(top,  #d5d8da,  #e8eaec); /* for firefox 3.6+ */

    box-shadow: 0px 1px 3px #999;
    margin: 6px 8px 6px 52px;
    -webkit-border-radius: 6px;
    -khtml-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;

    -webkit-transition-duration: 0.5s;
    padding: 4px 10px 6px 12px;
    min-height:32px;

}



.flag img {


}
.flag img:hover {

    -webkit-transform: scale(1.25);
    -moz-transform: scale(1.25);
    position: relative; z-index: 5;

}

.flag_current img {

    -webkit-box-reflect:below 0px url('../img/mask_reflection.png');
    width:32px;
    height:32px;
    border:0;
}
